<template>
  <a-modal 
    :visible="visible"
    okText="提交" 
    cancelText="关闭"
    :title="title"
    :footer="null"
    :maskClosable="false"
    :destroyOnClose="true"
    :keyboard="false"
    width="800px"
    :confirmLoading="confirmLoading"
    @cancel="closeModal()">
    <a-row style="margin-bottom: 20px">
      <a-button type="primary" style="margin-right: 20px" @click="infoVisible = true">新增</a-button>
      <!-- <a-button type="danger">删除</a-button> -->
    </a-row>
    <a-row>
      <a-table
        row-key="id"
        :pagination="false"
        :loading="loading"
        :columns="columns"
        :dataSource="dataSource"
      >

      </a-table>
    </a-row>
    <type-info @cancel="closeTypeModal" :visible="infoVisible" />
  </a-modal>
</template>
<script>
import TypeInfo from './TypeInfo'
export default {
  name: 'type-manage',
  components: {
    TypeInfo
  },
  props: {
    visible: {
      type: Boolean,
      default: false
    },
  },
  computed: {
    title () {
      return '供应商分类管理'
    },
    
  },
  data () {
    return {
      confirmLoading: false,
      loading: false,
      infoVisible: false,
      columns: [
        {title: '分类名称', dataIndex: 'typeName'},
        {title: '排序', dataIndex: 'sort'},
        {title: '创建时间', dataIndex: 'createDate'},
        {title: '操作', dataIndex: 'operation', customRender: (text, record) => <span class="text-danger pointer" onClick={()=>this.deleteSupplierType(record)}>删除</span>},
      ],
      dataSource: []
    }
  },
  watch: {
    visible (value) {
      if (value) {
        this.dataSource = []
        this.getList()
      }
    }
  },
  mounted () {
  },
  methods: {
    deleteSupplierType (record) {
      const params = [record.id]
      this.$confirm({
        title: '操作提示',
        content: `请确认是否删除分类：${record.typeName || ''}`,
        okText: '确认',
        cancelText: '取消',
        onOk: () => {
          return new Promise((resolve, reject)=> {
            this.$post('/supplier/type/delete', params).then(res => {
              if (res && res.returnCode === 1000) {
                this.$message.success('删除成功！')
                this.getList()
                resolve()
              } else {
                reject()
              }
            }).catch(err=> {
              reject()
            })
          })
        }
      })
    },
    getList(){
      this.loading = true
      this.$get(`/supplier/type/list`, {}, {preventLoading: true}).then(res => {
        this.loading = false
        if (res && res.returnCode === 1000) {
          this.dataSource = res.dataInfo
        }
      }).catch(err=> {
        this.loading = false
      })
    },
    closeTypeModal (flag) {
      this.infoVisible = false
      if (flag) {
        this.getList()
      }
    },
    closeModal () {
      this.$emit('cancel')
    },
  }
}
</script>